﻿@{
    Layout = null;
}

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewData["Title"]</title>
    <!-- 引入 Vue 的 JavaScript 文件 -->
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
    <!-- 引入 Element UI 的 CSS 文件 -->
    <link href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" rel="stylesheet" />
    <!-- 引入 Element UI 的 JavaScript 文件 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>

    <!-- 引入 Axios 的 JavaScript 文件 -->
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.js"></script>
</head>
<body>

    <div id="app">
        <div style="text-align:right">
            <el-button type="primary"  v-on:click="Inserts()">添加</el-button>
        </div>
        <el-table :data="tableData"
                  border
                  style="width: 100%">
            <el-table-column prop="rolesID"
                             label="角色编号">
            </el-table-column>
            <el-table-column prop="rolesName"
                             label="角色名称">
            </el-table-column>
            <el-table-column prop="rolesInstruction"
                             label="角色说明">
            </el-table-column>
            <el-table-column prop="rolesIf"
                             label="是否可用">
            </el-table-column>
           <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button v-if="scope.row.rolesName == '系统管理员'" clearable :disabled='true' type="primary" icon="el-icon-edit" circle v-on:click="drawer = true,Updatesid(scope.row.rolesID)"></el-button>
                    <el-button v-if="scope.row.rolesName != '系统管理员'" type="primary" icon="el-icon-edit" circle v-on:click="drawer = true,Updatesid(scope.row.rolesID)"></el-button>
                    <el-button v-if="scope.row.rolesName == '系统管理员'" clearable :disabled='true' type="danger" icon="el-icon-delete" circle v-on:click="deletes(scope.row.rolesID)"></el-button>
                    <el-button v-if="scope.row.rolesName != '系统管理员'" type="danger" icon="el-icon-delete" circle v-on:click="deletes(scope.row.rolesID)"></el-button>
                </template>
            </el-table-column>
        </el-table>

        <el-drawer style="height:2000px" :visible.sync="drawer"
                   :direction="direction"
                   :before-close="handleClose">
                   
            <el-tree :data="data"
                     default-expand-all
                     accordion
                     ref="rolesJurisdiction"
                     show-checkbox
                     node-key="juriID"
                     :default-checked-keys.sync="defualtkeys"
                     :props="defaultProps"
                     @@check="getid">
            </el-tree>

            <el-button type="primary" v-on:click="RJInserts()">确认</el-button>

        </el-drawer>

    </div>
    <script type="text/javascript">
        var vm = new Vue({
            el: "#app",
            data: {
                rolesJurisdiction:[],
                drawer: false,
                direction: 'rtl',
                tableData: [],
                data: [],
                defaultProps: {
                    label: "jurName",
                    children: "children"
                },
                defualtkeys: [],
                uid: 0
            },
            methods: {
                //查询用户数据
                fill() {
                    axios.get('/User/RolesSelect')
                        .then(res => {
                            console.log(res.data);
                            this.tableData = res.data
                        })
                        .catch(err => {
                            console.log(err);
                        })
                },
                //增加页面
                Inserts() {
                    window.location.href = '../User/right_add';
                },
                //删除
                deletes(id) {
                    // if (confirm("确认删除吗？")) {
                    //     axios.post('/User/DeleteRoles?id=' + id)
                    //         .then(res => {
                    //             if (res.data) {
                    //                 alert("删除成功");
                    //                 this.fill()
                    //             } else {
                    //                 alert("删除失败！");
                    //             }
                    //         })
                    //         .catch(err => {
                    //             console.log(err);
                    //         })
                    // }
                },
                //关闭抽屉
                handleClose(done) {
                    this.$confirm('确认关闭？')
                        .then(_ => {
                            done();
                        })
                        .catch(_ => { });
                },
                //查询所有权限
                Updates() {
                    axios.get('/User/trees2')
                        .then(res => {
                            console.log(res.data);
                            this.data = res.data
                        })
                        .catch(err => {
                            console.log(err);
                        })
                },
                //查询指定角色权限
                Updatesid(id) {

                    sessionStorage.setItem('uId5', JSON.stringify(id || '[]'));//把值存到session中
                    window.location.href = "/User/right_list_information";//页面跳转

                    // this.uid = id
                    // axios.get('/User/selectRolesJurisdiction?id='+id)
                    //     .then(res => {
                    //         console.log(res.data);
                    //         this.defualtkeys = res.data
                    //         alert(this.defualtkeys);
                    //     })
                    //     .catch(err => {
                    //         console.log(err);
                    //     })
                },
                //查看节点选中
                getid() {
                    this.rolesJurisdiction = this.$refs.rolesJurisdiction.getCheckedKeys();
                },
                RJInserts() {
                    // axios.get(`/usermanagement/deleteRolesJurisdiction?id=${this.uid}`)
                    //     .then(res => {
                           
                    //             alert("删除成功")
                            
                    //         for (var i in this.rolesJurisdiction) {
                    //             //alert(this.rolesJurisdiction);
                    //             axios.post('/usermanagement/insertRolesJurisdiction', {
                    //                 RolesID: this.uid,
                    //                 JuriID: this.rolesJurisdiction[i]
                    //             })
                    //                 .then(res => {
                                      
                    //                         console.log("增加成功");
                                      
                    //                 })
                    //                 .catch(err => {
                    //                     console.log(err);
                    //                 })
                    //         }
                    //     })
                    //     .catch(err => {
                    //         console.log(err);
                    //     })
                }
            },
            //窗体预加载事件
            mounted: function () {
                this.fill()
                this.Updates()
            }
        })
    </script>

</body>
</html>
